<template>
  <view class="user-section">
    <view class="user-info">
      <image :src="asyncImgs.alipay.local_icon" alt=""></image>
      <text class="user-name">{{ order.re_name }}</text>
      <text>{{ order.re_mobile }}</text>
    </view>
    <view class="address-info">{{$t('common.address')}}：{{order.re_address}}</view>
  </view>
</template>

<script>
export default {
  data() {
    return {};
  },
  props: {
    order: {
      type: Object,
      default: () => {
        return {};
      },
    },
  },
  filters: {},
};
</script>

<style lang="scss"scoped>
.user-section {
  width: 100%;
  background: #ffffff;
  border-radius: 24rpx;
  padding: 40rpx 36rpx;
  margin-bottom: 24rpx;

  .user-info {
    display: flex;
    align-items: center;
    font-size: 26rpx;
    font-family: PingFang SC;
    font-weight: 500;
    color: #262626;
    line-height: 44rpx;

    image {
      width: 28rpx;
      height: 28rpx;
      display: block;
    }
    .user-name {
      margin: 0 25rpx 0 15rpx;
    }
  }

  .address-info {
    padding-left: 41rpx;
    font-size: 24rpx;
    font-family: PingFang SC;
    font-weight: 400;
    color: #8c8c8c;
    line-height: 44rpx;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
  }
}
</style>
